<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MIFARE ONE DEMO</title>
<style type="text/css">
</style>
</head>

<!--<script type="text/javascript" src="/static/manage_device/rdapi.js"></script>-->
<script th:src="@{/manage_device/rdapi.js}"></script>
<!--<script th:src="@{/js/jquery-3.2.1.slim.min.js}"></script> slim版本的jquery移除了一些东西，其中包括ajax-->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script type="text/javascript">

var GFUNC = {
	M1_findCard:1,
	M1_authentication:2,
	M1_read:3,
	M1_write:4,
	M1_initVal:5,
	M1_increment:6,
	M1_decrement:7,
	M1_readVal:8,
	M1_updateKey:9,
};

 var g_device = "00"; //设备句柄号
 var g_isOpen = false;
 var g_blockAddr;
 var g_blockData;
 var g_key;
 var g_keyType;
 var g_vale;
 var g_wantFunc = 0;


/**
 * Reader callback function，the command response is processed here
 * (读卡器回调函数，在这里对命令应答进行处理)
**/
reader.onResult(function(rData)
{
	switch(rData.strCmdCode)
  {
		case "0007": //Sys_Open
			if(rData.strStatus != "00")
      {
				document.getElementById('tfTips').value =  "Failed to connect device ! " + "Error code: 0x" + rData.strStatus;
			}
			else
			{
        g_isOpen = true;
				document.getElementById('tfTips').value =  "Reader connected successfully !";
			}
			break;

		case "0009": //Sys_Close
			if(rData.strStatus != "00")
      {
				document.getElementById('tfTips').value =  "Failed to disconnect device !";
			}
			else
			{
				document.getElementById('tfTips').value = "Reader disconnected successfully !";
			}
			break;

		case "0106": //Sys_SetBuzzer
			break;

		case "0105": //Sys_GetSnr
			if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "Sys_GetSnr faild !";
			}
      else
      {
        document.getElementById('tfTips').value = rData.strData;//展示这一条数据这个是唯一标识
        //document.getElementById('tfTips').value = "Get device serial number successfully !";
        debugger;
        setAjax(rData.strData)
      }
			break;
		
		case "1001": //TyA_Request
			if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_Request faild !";
				return;
			}

			switch(g_wantFunc)
			{
				case GFUNC.M1_findCard:
				case GFUNC.M1_authentication:
				case GFUNC.M1_read:
				case GFUNC.M1_write:
				case GFUNC.M1_initVal:
				case GFUNC.M1_increment:
				case GFUNC.M1_decrement:
				case GFUNC.M1_readVal:
				case GFUNC.M1_updateKey:
					reader.send(g_device + "1002"); //TyA_Anticollision
				break;
			}

			break;

		case "1002": //TyA_Anticollision
			if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_Anticollision faild !";
				return;
			}

			switch(g_wantFunc)
			{
				case GFUNC.M1_findCard:
          document.getElementById('tfUID').value = rData.strData;
          document.getElementById('tfTips').value = "Found card !";
				case GFUNC.M1_authentication:
				case GFUNC.M1_read:
				case GFUNC.M1_write:
				case GFUNC.M1_initVal:
				case GFUNC.M1_increment:
				case GFUNC.M1_decrement:
				case GFUNC.M1_readVal:
				case GFUNC.M1_updateKey:
					reader.send(g_device + "1003" + rData.strData); //TyA_Select
				break;
			}

			break;

		case "1003": //TyA_Select
			if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_Select faild !";
				return;
			}

			switch(g_wantFunc)
			{
				case GFUNC.M1_authentication:
				case GFUNC.M1_read:
				case GFUNC.M1_write:
				case GFUNC.M1_initVal:
				case GFUNC.M1_increment:
				case GFUNC.M1_decrement:
				case GFUNC.M1_readVal:
				case GFUNC.M1_updateKey:
					reader.send(g_device + "100A" + g_keyType + g_blockAddr + g_key); //TyA_CS_Authentication2
				break;
			}

			break;

		case "100A": //TyA_CS_Authentication2
			if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value =  "TyA_CS_Authentication2 faild !";
				return;
			}

			switch(g_wantFunc)
			{
				case GFUNC.M1_read:
					reader.send(g_device + "100B" + g_blockAddr); //TyA_CS_Read
					break;

				case GFUNC.M1_write:
					reader.send(g_device + "100C" + g_blockAddr + g_blockData);
          break;
          
        case GFUNC.M1_initVal:
          reader.send(g_device + "100D" + g_blockAddr + g_value);
          break;

        case GFUNC.M1_readVal:
          reader.send(g_device + "100E" + g_blockAddr);
          break;

        case GFUNC.M1_decrement:
          reader.send(g_device + "100F" + g_blockAddr + g_value);
          break;

        case GFUNC.M1_increment:
          reader.send(g_device + "1010" + g_blockAddr + g_value);
          break;
			}		

			break;

		case "100B": //TyA_CS_Read
			if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_CS_Read faild !";
			}
      else
      {
        document.getElementById('tfBlockData').value = rData.strData;
        document.getElementById('tfTips').value = "Read block successfully !";
      }
			break;	
			
		case "100C": //TyA_CS_Write
			if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_CS_Write faild !";
			}
			else
			{
				document.getElementById('tfTips').value = "Write block successfully !";
			}
      break;	
      
    case "100D": //TyA_CS_InitValue 
      if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_CS_InitValue faild !";
			}
			else
			{
				document.getElementById('tfTips').value = "Initialize the wallet value successfully !";
			}
      break;

    case "100E": //TyA_CS_ReadValue
      if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_CS_ReadValue faild !";
			}
			else
			{
        var hexValue = rData.strData;
        hexValue = hexValue.substr(6,2) + hexValue.substr(4,2) + hexValue.substr(2,2) + hexValue.substr(0,2); //Reverse sorting of high and low bytes (高低字节反过来排序)
        var decValue = parseInt(hexValue, 16); //Convert hexadecimal string to decimal string (十六进制字符串转换为十进制字符串)
        document.getElementById("tfValue").value = decValue; //Show wallet balance (显示电子钱包余额)
				document.getElementById('tfTips').value = "Read value successfully !";
			}
      break;  
      
    case "100F": //TyA_CS_Decrement
      if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_CS_Decrement faild !";
			}
			else
			{
				document.getElementById('tfTips').value = "Decrement value successfully !";
			}
      break;

    case "1010": //TyA_CS_Increment 
      if(rData.strStatus != "00")
			{
				document.getElementById('tfTips').value = "TyA_CS_Increment faild !";
			}
			else
			{
				document.getElementById('tfTips').value = "Increment value successfully !";
			}
      break;
  }
	
}
);

/**
 * Function：Converts a decimal string to a hexadecimal string with a specified number of digits.
             (十进制字符串转换为指定位数的十六进制字符串)
 * Parameter：decimalStr [IN] Decimal string. (十进制字符串)
 *            length [IN] Specifies the number of digits to convert to hexadecimal. (指定要转换成十六进制的位数)
 * Return：Hexadecimal string. (十六进制字符串)
**/
function DecStrToHexStr(decimalStr, length)
{
  var num = Number(decimalStr);
  num =Math.floor(num);
  var str = (Array(length).join('0') + num.toString(16)).slice(-length);;
  return str;
}

/**
 * 功能：数字转换为指定位数的十六进制字符串
 * numValue [IN] 数字值
 * length [IN] 指定要转换成十六进制的位数
 * 返回：十六进制字符串
**/
// function NumberToHexStr(numValue, length)
// {
//   var str = (Array(length).join('0') + numValue.toString(16)).slice(-length);;
//   return str;
// }

/**
 * Turn on the green light
 * (亮绿灯)
**/
function LedGreen()
{
  reader.send(g_device + "0107" + "02"); 
}

/**
 * Turn on the red light
 * (亮红灯)
**/
function LedRed()
{
  reader.send(g_device + "0107" + "01"); 
}

/**
 * Connect the reader and initialize the working mode
 * (连接读卡器并初始化工作模式)
**/
function Connect()
{
	reader.send(g_device + "0007" + "00"); //Open the USB device with index number 0. (打开索引号为0的USB设备)，返回数据写入到前台
	reader.send(g_device + "0109" + "41"); //Set to ISO14443a working mode. (设置为ISO14443A工作模式，不返回数据
	reader.send(g_device + "0108" + "01"); //Turn on the reader antenna. (打开读卡器天线)//不返回数据
  LedGreen();
  setTimeout("LedRed()","200"); 
  reader.send(g_device + "0106" + "10"); //Beeps. (蜂鸣提示)//不返回数据
  reader.send(g_device+"0105");
}

/**
 * Reading card number
 * (寻卡并读卡号)
**/
function Request() 
{
  //Check whether the reader is opened or not.
  if(g_isOpen != true)
  {
    document.getElementById("tfTips").value = "Please connect the device first !";
    return;
  }

  //Clear UID edit box
  document.getElementById('tfUID').value = "";

  //Start read UID
  reader.send(g_device + "1001" + "52"); //TyA_Request
	g_wantFunc = GFUNC.M1_findCard;  
}

/**
 * Read a block of M1 card
 * (读M1卡的一个块)
**/
function ReadBlock() 
{
    //Check whether the reader is opened or not.
    if(g_isOpen != true)
    {
      document.getElementById("tfTips").value = "Please connect the device first !";
      return;
    }

    //Clear block data 
    document.getElementById('tfBlockData').value = "";

    //Get block address
    g_blockAddr = document.getElementById("tfBlock").value;
    if(g_blockAddr == "")
    {
        document.getElementById("tfTips").value="Please enter  block address !";
        return;
    }
    g_blockAddr = DecStrToHexStr(g_blockAddr, 2);
    
    //Get key
    g_key = document.getElementById("tfKey").value;
    if(g_key.length != 12)
    {
        document.getElementById("tfTips").value = "Please enter a 12-digit key !";
        return;
    }
    
    //Get key type
    if(rbKeyA.checked)
    {
      g_keyType = "60";
    }
    else
    {
      g_keyType = "61";
    }

    //Start read block
    reader.send(g_device + "1001" + "52"); //TyA_Request
    g_wantFunc = GFUNC.M1_read;
}

/**
 * Write a block of M1 card
 * (写M1卡的一个块)
**/
function WriteBlock() 
{
    //Check whether the reader is opened or not.
    if(g_isOpen != true)
    {
      document.getElementById("tfTips").value = "Please connect the device first !";
      return;
    }

    //Get block address
    g_blockAddr = document.getElementById("tfBlock").value;
    if(g_blockAddr == "")
    {
        document.getElementById("tfTips").value="Please enter  block address !";
        return;
    }
    g_blockAddr = DecStrToHexStr(g_blockAddr, 2);
    
    //Get key
    g_key = document.getElementById("tfKey").value;
    if(g_key.length != 12)
    {
        document.getElementById("tfTips").value = "Please enter a 12-digit key !";
        return;
    }
    
    //Get key type
    if(rbKeyA.checked)
    {
      g_keyType = "60";
    }
    else
    {
      g_keyType = "61";
    }

    //Get block data
    g_blockData = document.getElementById("tfBlockData").value;
    if(g_blockData.length != 32)
    {
        document.getElementById("tfTips").value = "Please enter a 32-digit block data !";
        return;
    }

    //Start write block
    reader.send(g_device + "1001" + "52"); //TyA_Request
    g_wantFunc = GFUNC.M1_write;
}

/**
 * Initialize one block of M1 card as e-wallet, be careful not to use password blocks
 * (将M1卡的一个块初始化为电子钱包,注意不要使用密码块)
**/
function InitValue() 
{
    //Check whether the reader is opened or not.
    if(g_isOpen != true)
    {
      document.getElementById("tfTips").value = "Please connect the device first !";
      return;
    }

    //Get block address
    g_blockAddr = document.getElementById("tfBlock2").value;
    if(g_blockAddr == "")
    {
        document.getElementById("tfTips").value="Please enter  block address !";
        return;
    }
    g_blockAddr = DecStrToHexStr(g_blockAddr, 2);
    
    //Get key
    g_key = document.getElementById("tfKey").value;
    if(g_key.length != 12)
    {
        document.getElementById("tfTips").value = "Please enter a 12-digit key !";
        return;
    }
    
    //Get key type
    if(rbKeyA.checked)
    {
      g_keyType = "60";
    }
    else
    {
      g_keyType = "61";
    }

    //Get value
    var decValue = document.getElementById("tfValue").value;
    if(decValue == "")
    {
        document.getElementById("tfTips").value = "Please enter a value !";
        return;
    }
    var hexValue = DecStrToHexStr(decValue, 8); //Converts a decimal string to an 8-bit hexadecimal string (十进制字符串转换为4字节即8位十六进制字符串)
    g_value = hexValue.substr(6,2) + hexValue.substr(4,2) + hexValue.substr(2,2) + hexValue.substr(0,2); //Reverse sorting of high and low bytes (高低字节反过来排序)

    //Start init value
    reader.send(g_device + "1001" + "52"); //TyA_Request
    g_wantFunc = GFUNC.M1_initVal;
}

/**
 * E-wallet recharge
 * (电子钱包充值)
**/
function IncValue() 
{
    //Check whether the reader is opened or not.
    if(g_isOpen != true)
    {
      document.getElementById("tfTips").value = "Please connect the device first !";
      return;
    }

    //Get block address
    g_blockAddr = document.getElementById("tfBlock2").value;
    if(g_blockAddr == "")
    {
        document.getElementById("tfTips").value="Please enter  block address !";
        return;
    }
    g_blockAddr = DecStrToHexStr(g_blockAddr, 2);
    
    //Get key
    g_key = document.getElementById("tfKey").value;
    if(g_key.length != 12)
    {
        document.getElementById("tfTips").value = "Please enter a 12-digit key !";
        return;
    }
    
    //Get key type
    if(rbKeyA.checked)
    {
      g_keyType = "60";
    }
    else
    {
      g_keyType = "61";
    }

    //Get value
    var decValue = document.getElementById("tfValue").value;
    if(decValue == "")
    {
        document.getElementById("tfTips").value = "Please enter a value !";
        return;
    }
    var hexValue = DecStrToHexStr(decValue, 8); //Converts a decimal string to an 8-bit hexadecimal string (十进制字符串转换为4字节即8位十六进制字符串)
    g_value = hexValue.substr(6,2) + hexValue.substr(4,2) + hexValue.substr(2,2) + hexValue.substr(0,2); //Reverse sorting of high and low bytes (高低字节反过来排序)

    //Start init value
    reader.send(g_device + "1001" + "52"); //TyA_Request
    g_wantFunc = GFUNC.M1_increment;
}

/**
 * Electronic wallet deduction
 * (电子钱包扣款)
**/
function DecValue() 
{
    //Check whether the reader is opened or not.
    if(g_isOpen != true)
    {
      document.getElementById("tfTips").value = "Please connect the device first !";
      return;
    }

    //Get block address
    g_blockAddr = document.getElementById("tfBlock2").value;
    if(g_blockAddr == "")
    {
        document.getElementById("tfTips").value="Please enter  block address !";
        return;
    }
    g_blockAddr = DecStrToHexStr(g_blockAddr, 2);
    
    //Get key
    g_key = document.getElementById("tfKey").value;
    if(g_key.length != 12)
    {
        document.getElementById("tfTips").value = "Please enter a 12-digit key !";
        return;
    }
    
    //Get key type
    if(rbKeyA.checked)
    {
      g_keyType = "60";
    }
    else
    {
      g_keyType = "61";
    }

    //Get value
    var decValue = document.getElementById("tfValue").value;
    if(decValue == "")
    {
        document.getElementById("tfTips").value = "Please enter a value !";
        return;
    }
    var hexValue = DecStrToHexStr(decValue, 8); //Converts a decimal string to an 8-bit hexadecimal string (十进制字符串转换为4字节即8位十六进制字符串)
    g_value = hexValue.substr(6,2) + hexValue.substr(4,2) + hexValue.substr(2,2) + hexValue.substr(0,2); //Reverse sorting of high and low bytes (高低字节反过来排序)

    //Start init value
    reader.send(g_device + "1001" + "52"); //TyA_Request
    g_wantFunc = GFUNC.M1_decrement;
}

/**
 * Read e-wallet balance
 * (读电子钱包余额)
**/
function ReadValue() 
{
	debugger;
      //Check whether the reader is opened or not.
      if(g_isOpen != true)
    {
      document.getElementById("tfTips").value = "Please connect the device first !";
      return;
    }

    //Clear value edit box
    document.getElementById('tfValue').value = "";

    //Get block address
    g_blockAddr = document.getElementById("tfBlock2").value;
    if(g_blockAddr == "")
    {
        document.getElementById("tfTips").value="Please enter  block address !";
        return;
    }
    g_blockAddr = DecStrToHexStr(g_blockAddr, 2);
    
    //Get key
    g_key = document.getElementById("tfKey").value;
    if(g_key.length != 12)
    {
        document.getElementById("tfTips").value = "Please enter a 12-digit key !";
        return;
    }
    
    //Get key type
    if(rbKeyA.checked)
    {
      g_keyType = "60";
    }
    else
    {
      g_keyType = "61";
    }

    //Start init value
    reader.send(g_device + "1001" + "52"); //TyA_Request
    g_wantFunc = GFUNC.M1_readVal;
}

function setAjax(id){
  debugger;
  $.ajax({
    url: 'http://127.0.0.1:8081/manage/ImportManageId', // 后端处理请求的 URL
    type: 'POST', // 请求类型，可以是 GET 或 POST
    data:JSON.stringify({'name':id}), // 发送到后端的数据
    contentType:'application/json',
    success: function(response) {
      // 请求成功后的回调函数
      //$('#response').text(response);
      console.log(response);
    },
    error: function(xhr, status, error) {
      // 请求失败后的回调函数
      console.error("An error occurred: " + status + "\nError: " + error);
    }
  });
}

</script>


<body>
<p>&nbsp;</p>
<div align="center">
  <table width="545" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <th height="24" colspan="6" bgcolor="#FFFFFF" scope="col"><strong>MIFARE ONE DEMO (Javascript)</strong></th>
    </tr>
    <tr>
      <th height="24" colspan="6" bgcolor="#FFFFFF" scope="col">&nbsp;</th>
    </tr>
    <tr>
      <th height="24" colspan="6" bgcolor="#FFFFFF" scope="col"><form id="form1" name="form1" method="post" action="">
        <div align="left">
          <input name="btnConnect" type="button" id="btnConnect" onclick="Connect()" value="Connect Reader" />
        </div>
      </form></th>
    </tr>
    <tr>
      <td height="19" colspan="6" bgcolor="#EFEFEF">&nbsp;</td>
    </tr>
    <tr>
      <td height="30" colspan="6" bgcolor="#EFEFEF"><em><strong>[UID]</strong>
      </em>
        <input name="tfUID" type="text" id="tfUID" size="20" maxlength="16" /> <input name="btnRequest" type="button" id="btnRequest" onclick="Request()" value="Request" /></td>
    </tr>
    <tr>
      <td height="19" colspan="6" bgcolor="#EFEFEF">  ------------------------------------------------------------------------------------------</td>
    </tr>
    <tr>
      <td height="30" colspan="6" bgcolor="#EFEFEF"><div align="left"><em> <strong>[Block operation]</strong></em></div></td>
    </tr>
    <tr>
      <td width="69" height="23" bgcolor="#EFEFEF"><div align="right">Block:</div></td>
      <td width="7" bgcolor="#EFEFEF">&nbsp;</td>
      <td height="30" colspan="4" bgcolor="#EFEFEF"><input name="tfBlock" type="text" id="tfBlock" value="1" size="8" maxlength="2" />
      (Decimal, from 1 to 63 for S50 card.) </td>
    </tr>
    <tr>
      <td height="30" bgcolor="#EFEFEF"><div align="right">Key:  </div></td>
      <td bgcolor="#EFEFEF">&nbsp;</td>
      <td colspan="2" bgcolor="#EFEFEF">  <input name="tfKey" type="text" id="tfKey" value="FFFFFFFFFFFF" size="20" maxlength="12" /></td>
      <td bgcolor="#EFEFEF">KeyA
      <input name="radio" type="radio" id="rbKeyA" value="rbKeyA" checked="checked" /></td>
      <td bgcolor="#EFEFEF">KeyB 
      <input type="radio" name="radio" id="rbKeyB" value="rbKeyB" /></td>
    </tr>
    <tr>
      <td height="30" bgcolor="#EFEFEF"><div align="right">Data:</div></td>
      <td bgcolor="#EFEFEF">&nbsp;</td>
      <td colspan="4" bgcolor="#EFEFEF"><form id="form2" name="form2" method="post" action="">
        <label for="tfBlockData"></label>
        <input name="tfBlockData" type="text" id="tfBlockData" size="40" maxlength="32" />
      </form></td>
    </tr>
    <tr>
      <td height="30" bgcolor="#EFEFEF">&nbsp;</td>
      <td height="31" bgcolor="#EFEFEF">&nbsp;</td>
      <td height="31" colspan="2" bgcolor="#EFEFEF"> <div align="center">
          <input name="btnReadBlock" type="button" id="btnReadBlock" onclick="ReadBlock()" value=" Read " />
      </div></td>
      <td width="98" bgcolor="#EFEFEF"><input name="btnWriteBlock" type="button" id="btnWriteBlock" onclick="WriteBlock()" value="Write" /></td>
      <td width="174" bgcolor="#EFEFEF">&nbsp;</td>
    </tr>
    <tr>
      <td height="19" colspan="6" bgcolor="#EFEFEF">------------------------------------------------------------------------------------------</td>
    </tr>
    <tr>
      <td height="19" colspan="6" bgcolor="#EFEFEF"><div align="left"><em><strong>[</strong></em><strong><em>E-wallet function]</em></strong>      </div></td>
    </tr>
    <tr>
      <td height="30" bgcolor="#EFEFEF"><div align="right">Block:</div></td>
      <td bgcolor="#EFEFEF">&nbsp;</td>
      <td colspan="4" bgcolor="#EFEFEF"><form id="form3" name="form3" method="post" action="">
        <label for="tfBlock2"></label>
        <input name="tfBlock2" type="text" id="tfBlock2" value="1" size="8" maxlength="2" />
        (Decimal, from 1 to 63 for S50 card.)
      </form></td>
    </tr>
    <tr>
      <td height="30" bgcolor="#EFEFEF"><div align="right">Key</div></td>
      <td bgcolor="#EFEFEF">&nbsp;</td>
      <td colspan="2" bgcolor="#EFEFEF"><form id="form4" name="form4" method="post" action="">
        <label for="tfKey2"></label>
        <input name="tfKey2" type="text" id="tfKey2" value="FFFFFFFFFFFF" size="20" maxlength="12" />
      </form></td>
      <td bgcolor="#EFEFEF">KeyA 
        <input name="radio1" type="radio" id="rbKeyA2" value="rbKeyA2" checked="checked" /></td>
      <td bgcolor="#EFEFEF">KeyB 
        <input type="radio" name="radio1" id="rbKeyB2" value="rbKeyB2" /></td>
    </tr>
    <tr>
      <td height="30" bgcolor="#EFEFEF"><div align="right">Value:</div></td>
      <td bgcolor="#EFEFEF">&nbsp;</td>
      <td colspan="4" bgcolor="#EFEFEF"><form id="form5" name="form5" method="post" action="">
        <label for="tfValue"></label>
        <input name="tfValue" type="text" id="tfValue" size="20" maxlength="11" />
      (Decimal, from 0 to 4294967295)
      </form></td>
    </tr>
    <tr>
      <td height="30" bgcolor="#EFEFEF">&nbsp;</td>
      <td bgcolor="#EFEFEF">&nbsp;</td>
      <td width="98" bgcolor="#EFEFEF"><form id="form6" name="form6" method="post" action="">
        <input name="btnInitValue" type="button" id="btnInitValue" onclick="InitValue()" value="InitValue" />
      </form></td>
      <td width="99" bgcolor="#EFEFEF"><form id="form7" name="form7" method="post" action="">
        <input name="btnIncValue" type="button" id="btnIncValue" onclick="IncValue()" value="IncValue" />
      </form></td>
      <td bgcolor="#EFEFEF"><form id="form8" name="form8" method="post" action="">
        <input name="btnDecValue" type="button" id="btnDecValue" onclick="DecValue()" value="DecValue" />
      </form></td>
      <td bgcolor="#EFEFEF"><form id="form9" name="form9" method="post" action="">
        <input name="btnReadValue" type="button" id="btnReadValue" onclick="ReadValue()" value="ReadValue" />
      </form></td>
    </tr>
    <tr>
      <td height="19" colspan="6" bgcolor="#EFEFEF">------------------------------------------------------------------------------------------</td>
    </tr>
    <tr>
      <td height="30" colspan="6" bgcolor="#EFEFEF"><em><strong> [Tips]</strong></em>
        <form id="form10" name="form10" method="post" action="">
          <label for="tfTips"></label>
          <input name="tfTips" type="text" id="tfTips" size="70" maxlength="70" />
</form></td>
    </tr>
    <tr>
      <td height="23" colspan="6" bgcolor="#EFEFEF">&nbsp;</td>
    </tr>
    <tr>
      <td height="23" colspan="6"><p>Note: the key block should not be written at will, the key block is 3, 7, 11, 15, 19, 23, 27... ...</p></td>
    </tr>
  </table>
  <p>&nbsp;</p>
</div>
<p>&nbsp;</p>
</body>
</html>